<template>
	<uni-popup ref="popup" type="dialog">
		<view class="dialog-wrap">
			<view class="icon-success">
				<image :src="url"></image>
			</view>
			<view class="cont">{{title}}</view>
			<view class="btn-box flex_a">
				<view class="btn-item flex_col end" @click="confirm">{{$t('gotit')}}</view>
				<view v-if="show" class="btn-item flex_col end" @click="retry">{{$t('retry')}}</view>
			</view>
		</view>
	</uni-popup>
</template>

<script>
	export default {
		name: 'PopupTips',
		props: {

			url: {
				type: String,
				default: '/static/image/icon-success.png'
			},

			title: {
				type: String,
				default: ''
			},
			show: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				open() {
					this.$refs.popup.open();
				},
				close() {
					this.$refs.popup.close();
				},
				confirm() {
					this.$refs.popup.close();
					this.$emit('confirm');
				},
				retry() {
					this.$refs.popup.close();
					this.$emit('retry');
				}
			};
		}
	}
</script>

<style lang="scss" scoped>
	.dialog-wrap {
		text-align: center;
		padding: 50rpx;
		background: #fff;
		border-radius: 20rpx;
		width: 70vw;

		.icon-success {
			width: 75rpx;
			height: 75rpx;
			margin: auto;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.cont {
			line-height: 51rpx;
			margin: 60rpx 0;
		}

		.btn-box {
			.btn-item {
				width: 244rpx;
				height: 80rpx;
				border-radius: 40rpx;
				border: 1px solid #AF9453;
				color: #AF9453;
			}
		}
	}
</style>